<template>
    <div>
        <div class="contact">
		<div class="container">
			<h3 class="agileits-title">重置密码</h3>
			<div class="contact-agileinfo">
                <!-- <div class="col-md-1"></div> -->
                <div class="col-md-12">
                            <el-form :model="form" :rules="rules" ref="form" label-width="100px" :label-position="labelPosition" >
                                <el-form-item label="原密码：" prop="password" style="width:70%">
                                    <el-input type="password" v-model="form.password" placeholder="原密码"></el-input>
                                </el-form-item>
                                <el-form-item label="新密码：" prop="pass" style="width:70%">
                                    <el-input type="password" v-model="form.pass" placeholder="新密码"></el-input>
                                </el-form-item>
                                <el-form-item label="确认密码：" prop="checkPass" style="width:70%">
                                    <el-input type="password" v-model="form.checkPass"  placeholder="重复密码"></el-input>
                                </el-form-item>
                                <el-form-item>
                                    <el-button type="primary" @click="submit('form')">提交</el-button>
                                </el-form-item>
                            </el-form>
                </div>
				<div class="clearfix"></div>
			</div>
		</div>
	</div>
    </div>
</template>

<script>
export default {
    data() {
        var validatePass = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请输入密码'));
        } else {
          if (this.form.checkPass !== '') {
            this.$refs.form.validateField('checkPass');
          }
          callback();
        }
      };
      var validatePass2 = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请再次输入密码'));
        } else if (value !== this.form.pass) {
          callback(new Error('两次输入密码不一致!'));
        } else {
          callback();
        }
      };
        return {
            labelPosition:'right',
            tabPosition:'left',
            form:{
                password:'',
                pass:'',
                checkPass:''
            },

            rules: {
                password:[
                    { required: true, message: '密码不能为空', trigger: 'blur' },
                ],
                pass: [
                    {required: true, validator: validatePass, trigger: 'blur' }
                ],
                checkPass: [
                    {required: true,  validator: validatePass2, trigger: 'blur' }
                ],
            }
        };
    },
    methods: {
        submit(form) {
            this.$refs[form].validate((valid) => {
            if (valid) {
                let formdata = new FormData()
                formdata.append('password1', this.form.password) // 原密码
                formdata.append('password2', this.form.pass) // 新密码
                const path = 'http://10.138.120.46:5000/api/updatepassword/' + this.$store.state.UID
                var config = {
                    headers: {
                        'Content-Type': 'multipart/form-data'  //之前说的以表单传数据的格式来传递fromdata
                    }
                };
                var that = this
                this.axios.post(path, formdata, config).then((response)=>{
                    if(response.data.info === 401){
                        this.$message({
                            type:'error',
                            message:'原密码输入错误，请重新输入！'
                        })
                    }else if(response.data.info === 402){
                        this.$message({
                            type:'error',
                            message:'原密码和新密码一致，请重新输入！'
                        })
                    }else{
                        localStorage.clear()
                        that.$router.go(0)
                        this.$message({
                            type:'success',
                            message:'密码修改成功，请重新登录！'
                        })
                    }
                }).catch((error)=>{
                    alert(error)
                })
            } else {
                
                return false;
            }
            });
      },
    },
};
</script>

<style scoped lang="scss">

</style>
